<!DOCTYPE html>
<!-- saved from url=(0059)http://wx.zhongfubang.com/yiyuan_order_info.html?order_id=1 -->
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

		<title>电子凭证详情</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no">
		<link href="./css/mui.min.css" rel="stylesheet">
		<link href="./css/pingzheng-info.css" rel="stylesheet">
		<style type="text/css" abt="234"></style>
		<style type="text/css"></style>
		<script>
			//console.log('a')
		</script>
		<script>
			//remove 17173 video ad
		</script>
		<style type="text/css">
			object,
			embed {
				-webkit-animation-duration: .001s;
				-webkit-animation-name: playerInserted;
				-ms-animation-duration: .001s;
				-ms-animation-name: playerInserted;
				-o-animation-duration: .001s;
				-o-animation-name: playerInserted;
				animation-duration: .001s;
				animation-name: playerInserted;
			}
			
			@-webkit-keyframes playerInserted {
				from {
					opacity: 0.99;
				}
				to {
					opacity: 1;
				}
			}
			
			@-ms-keyframes playerInserted {
				from {
					opacity: 0.99;
				}
				to {
					opacity: 1;
				}
			}
			
			@-o-keyframes playerInserted {
				from {
					opacity: 0.99;
				}
				to {
					opacity: 1;
				}
			}
			
			@keyframes playerInserted {
				from {
					opacity: 0.99;
				}
				to {
					opacity: 1;
				}
			}
		</style>
	</head>

	<body>
		<header class="mui-bar mui-bar-nav bgcolor">
			<a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
			<h1 class="mui-title">电子凭证详情</h1>
		</header>
		<div id="app" class="mui-content">
			<div class="head-title">
				<div class="mui-row">
					<p>电子凭证详情</p>
				</div>
			</div>
			<div class="mui-card">
				<div class="mui-card-content">
					<div class="block1">
						<div class="mui-row">
							<p class="name-info info">加入计划</p>
							<p id="productname" class="cont">
								{{order_info.productName}}
							</p>
						</div>
						<div class="mui-row">
							<p class="date-info info">加入日期</p>
							<template>
								<p id="date" class="cont">
									{{order_info.applyDateString}}
								</p>
							</template>
						</div>
						<div class="mui-row">
							<p class="date-info info">参与人（真实姓名/身份证号码）</p>
							<p id="identify" class="cont">
								{{order_info.applyPeopleName}}/{{order_info.idCode}}
							</p>
						</div>
					</div>
					<div class="block2">
						<div class="mui-row row1">
							<div class="mui-col-sm-6 mui-col-xs-6 left">
								最高可申请互助额度（元）
							</div>
							<div class="mui-col-sm-6 mui-col-xs-6 right">
								{{product.amountProtection}}
							</div>
						</div>
						<div class="mui-row row2">
							<div class="mui-col-sm-8 mui-col-xs-8 left">
								<p>互助年费&nbsp;&nbsp;
									<span class="money">￥ 
										<span id="number" class="number"></span>{{product.applyAmount}}</span>
								</p>
								<p><span id="status" class="numstate"> 
										(余额:{{order_info.amount}}元)
									</span> <span class="mui-icon mui-icon-info textcolor"></span></p>
							</div>
							<div class="mui-col-sm-4 mui-col-xs-4 right">
								<div class="mui-button-row"></div>
							</div>
						</div>
						<div class="mui-row row3">
							<p class="up">观察期进度&nbsp;&nbsp;
								<span id="daystatus" class="rate-state"> 
										{{order_info.observationPeriodStatus}}
									</span></p>
							<p class="down"><span class="mui-icon mui-icon-info textcolor"></span>&nbsp;&nbsp;当前
								<span id="day">{{order_info.totalDays}}</span>天
							</p>
						</div>
					</div>
				</div>
			</div>
			<div class="footer-btn">
				<div class="mui-button-row mui-row">
					<div class="mui-col-sm-12 mui-col-xs-12"><button type="button" onclick="applyProduct();" class="mui-btn mui-btn-warning bgcolor mui-col-sm-12 mui-col-xs-12">申请互助</button></div>
				</div>
			</div>
		</div>

		<!--弹框-->
		<div id="modal1" class="mui-popover">
			<span class="modal-close mui-pull-right" id="close"><span class="mui-icon mui-icon-closeempty"></span></span>
			<div class="modal-content">
				<div class="mui-scroll-wrapper">
					<div class="mui-scroll">
						<div class="terms" id="viewContent">
							<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
							<div class="" id="detail">
							</div>
							<!--明细载入动画-->
							<div class="loadingBar-doc hide">
								<div class="preloader-wrapper big active">
									<div class="spinner-layer spinner-red-only">
										<div class="circle-clipper left">
											<div class="circle"></div>
										</div>
										<div class="gap-patch">
											<div class="circle"></div>
										</div>
										<div class="circle-clipper right">
											<div class="circle"></div>
										</div>
									</div>
								</div>
							</div>
						</div>
					</div>
				</div>

			</div>
			<!--//弹框-->

			<script src="./js/mui.js"></script>
			<script src="js/jquery-1.10.2.min.js"></script>
			<script type="text/javascript" src="./js/vue.min.js"></script>
			<script type="text/javascript" src="./js/common.js"></script>
			<script type="text/javascript">
		

				mui.init({
				swipeBack: true //启用右滑关闭功能
			});

				var vue = new Vue({
					el: "#app",
					data: {
						order_info: [],
						product: [],
						vipAnnualFee :[]
					},
					methods: {
						cooperation_list: function(event) {
							var project_id = 3;
							mui.openWindow('cooperation_list.html?project_id=' + project_id, 'id', {})
						},
						applyhelp: function(event) {
							mui.openWindow('applyhelp.html', 'applyhelp', {})
						},
						showHelpList:function(){
							mui.alert("正在设计中，敬请期待");
						}
					}
				})

				mui.plusReady(function() {

				})

				window.onload = load();

				function load() {
					get_order_info();
				}

				function get_order_info() {
					var order_id = $.getUrlParam('order_id');
					var url = root + 'myCenter/detailElectronicProduct';
					mui.get(url, {
							id: order_id
						},
						function(result) {
							vue.order_info = result.data;
							getProdcutDetail();
							showVipAnnualFee(vue.order_info.idCode);
							//vue.product = data.product;
						}, 'json');

				}
				
				function getProdcutDetail(){
					var url = root + 'index/selectProductDetail';
					mui.get(url, {
							id: vue.order_info.productId
						},
						function(result) {
							vue.product = result.data;
						}, 'json'
					);
				}
				
				function applyProduct(){
					mui.openWindow('publicNotice.html', '', {});
				}
				
				
			</script>

		</div>
	</body>

</html>